<template>
  <div>
    <el-menu
      :default-active="activeMenu"
      :collapse="isActive"
      :unique-opened="false"
      :collapse-transition="false"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
      router
      mode="vertical"
    >
      <sidebar-item
        v-for="route in menulist"
        :key="route.path"
        :item="route"
        :base-path="route.path"
      />
    </el-menu>
  </div>
</template>

<script>
import SidebarItem from "./SidebarMenu";

export default {
  props: ["isActive"],
  components: {
    SidebarItem
  },
  computed: {
    activeMenu() {
      const route = this.$route;
      const { path } = route;
      return path;
    },
    getBlogSet() {
      return this.$store.state.setting;
    }
  },

  data() {
    return {
      menulist: [
        {
          path: "/admin",
          title: "管理系统主页",
          icon: "el-icon-tickets",
          type: "2", //1菜单，2路由，3按钮
          children: []
        },
        {
          path: "/admin/blog",
          title: "博客管理",
          icon: "el-icon-tickets",
          type: "2", //1菜单，2路由，3按钮
          children: []
        },
        {
          path: "/admin/role",
          title: "角色管理",
          icon: "el-icon-tickets",
          type: "1", //1菜单，2路由，3按钮
          children: [
            {
              path: "/admin/role/add",
              title: "权限控制",
              icon: "el-icon-tickets",
              type: "2" //1菜单，2路由，3按钮
            },
            {
              path: "/admin/roless2",
              title: "权限控制2",
              icon: "el-icon-tickets",
              type: "2" //1菜单，2路由，3按钮
            }
          ]
        },
        {
          path: "/admin/word",
          title: "每日美句",
          icon: "el-icon-tickets",
          type: "2", //1菜单，2路由，3按钮
          children: []
        }
      ]
    };
  }
};
</script>
